<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
这是登录界面
<!--登录-->
<button class="" lay-event="admin">登录</button>
<button class="" lay-event="sign">注册</button>

<script type="text/html" id="admin">
  <input type="text" id="login_username" name="username" placeholder="请输入用户名"><br>
  <input type="password" id="login_password" name="password" placeholder="请输入密码"><br>
  <button class="" lay-event="admin">登录</button>
</script>

<script type="text/html" id="sign">
  <input type="text" id="sign_username" name="username" placeholder="请输入用户名"><br>
  <input type="password" id="sign_password" name="password" placeholder="请输入密码"><br>
  <button class="" lay-event="sign">注册</button>
</script>
<script src="layui/layui.js" charset="utf-8"></script>
<script src="jquery/jquery-3.6.0.js" charset="utf-8"></script>
<script>
  $(document).ready(function() {
  // 登录按钮点击事件
  $('button[lay-event="admin"]').on('click', function() {
    layer.open({
      type: 1,
      title: '登录',
      closeBtn: true,
      area: ['400px', '300px'],
      shade: 0.5,
      id: 'LAY_login', // 设定一个id，防止重复弹出
      content: $('#admin').html(),
      btn: ['登录', '取消'],
      btnAlign: 'c',
      moveType: 1,
      btn1: function(index, layero){
        // 登录按钮执行的代码
        let username = $("#login_username").val();
        let password = $("#login_password").val();
        console.log(username);
        console.log(password);
        if(!username.trim() || !password.trim()){
          layer.msg("用户名或密码不能为空!");
          return;
        }else {
          layer.msg("登录中");
          $.ajax({
            url:"/login/selectLogin",           // 请求路径
            type:"post",                  // 请求的方式，不区分大小写
            cache:false,                  // 关闭缓存，目的是为了避免部分浏览器缓存加载出错(IE)
            contentType:"application/json;charset=utf-8",   // 告知浏览器，当前传递到后端服务的是一个json对象
            data: JSON.stringify({
              user_id:0,
              user_name:username,
              user_pwd:password
            }),  // {'username':'admin12', 'password':'123456'}
            datatype:"json",        // 返回类型，text文本、html页面、json数据
            success:function(response){
              console.log("返回: " + response);
              if(response.code === 200) {
                setTimeout(function() {
                  layer.close(index);// 关闭当前窗口
                  layer.msg("登录成功!");
                  window.location.href = 'index.html';
              }, 1000);
              }
              else {
                layer.msg("登录失败!账号密码错误");
              }
            },
            error:function(response){
              layer.msg("登录失败!账号密码错误");
              console.log("出错返回: " + response);
            }
          });
        }
        // 执行登录逻辑

      }
    });
  });

  // 注册按钮点击事件
  $('button[lay-event="sign"]').on('click', function() {
    layer.open({
      type: 1,
      title: '注册',
      closeBtn: true,
      area: ['400px', '300px'],
      shade: 0.5,
      id: 'LAY_sign', // 设定一个id，防止重复弹出
      content: $('#sign').html(),
      btn: ['注册', '取消'],
      btnAlign: 'c',
      moveType: 1,
      btn1: function(index, layero){
        // 注册按钮执行的代码
        let username = $("#sign_username").val();
        let password = $("#sign_password").val();
        console.log(username);
        console.log(password);
        if(!username.trim() || !password.trim()){
          layer.msg("用户名或密码不能为空!");
          return;
        }else {
          layer.msg("注册中");
          $.ajax({
            url:"/login/insertsign",           // 请求路径
            type:"post",                  // 请求的方式，不区分大小写
            cache:false,                  // 关闭缓存，目的是为了避免部分浏览器缓存加载出错(IE)
            contentType:"application/json;charset=utf-8",   // 告知浏览器，当前传递到后端服务的是一个json对象
            data: JSON.stringify({
              user_id:0,
              user_name:username,
              user_pwd:password
            }),  // {'username':'admin12', 'password':'123456'}
            datatype:"json",        // 返回类型，text文本、html页面、json数据
            success:function(response){
              console.log("返回: " + response);
              if(response.code === 200) {
                setTimeout(function() {
                  layer.close(index);// 关闭当前窗口
                  layer.msg("注册成功!");
                  window.location.href = 'login.html';
                }, 1000);
              }
            },
            error:function(response){
              layer.msg("注册失败!");
              console.log("出错返回: " + response);
            }
          });
        }
      }
    });
  });
});
</script>
</body>
</html>
